<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--[if lt IE 9]>
<script type="text/javascript" src="lib/html5shiv.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css" />
<!--[if IE 6]>
<script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<title>折线图</title>
</head>
<body>
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 统计管理 <span class="c-gray en">&gt;</span> 折线图 <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
<div class="page-container">
	<div class="f-14 c-error">特别声明：Highcharts 是一个用纯 JavaScript编写的一个图表库，仅免费提供给个人学习、个人网站，如果在商业项目中使用，请去Highcharts官网网站购买商业授权。或者您也可以选择其他免费的第三方图表插件，例如百度echarts。H-ui.admin不承担任何版权问题。</div>
	<div id="container" style="min-width:700px;height:400px"></div>
</div>
<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script> 
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="lib/hcharts/Highcharts/5.0.6/js/highcharts.js"></script>
<script type="text/javascript" src="lib/hcharts/Highcharts/5.0.6/js/modules/exporting.js"></script>
<script type="text/javascript">

    // January——一月           February——二月                 March——三月
    //
    // April——四月                May——五月                         June——六月
    //
    // July——七月                  August——八月                   September——九月
    //
    // October——十月          November——十一月          December——十二月

    var path = "/" + location.pathname.split("/")[1];



    var year=new Date().getFullYear();

    // function getNow(s) {
    //     return s < 10 ? '0' + s: s;
    // }
    // var myDate = new Date();
    // //获取当前年
    // var year=myDate.getFullYear();
    // //获取当前月
    // var month=myDate.getMonth()+1;
    // //获取当前日
    // var date=myDate.getDate();
    //
    // var now=year+'-'+getNow(month)+"-"+getNow(date);


$(function () {



    //传入的集合中的map必须包含month和num字段
    function listToAll(list){
        var January=0;
        var February=0;
        var March=0;
        var April=0;
        var May=0;
        var June=0;
        var July=0;
        var August=0;
        var September=0;
        var October=0;
        var November=0;
        var December=0;
        $.each(list,function (i,li) {

            if(li.month==year+"-01"){
                January=li.num;
            }
            if(li.month==year+"-02"){
                February=li.num;
            }
            if(li.month==year+"-03"){
                March=li.num;
            }
            if(li.month==year+"-04"){
                April=li.num;
            }
            if(li.month==year+"-05"){
                May=li.num;
            }
            if(li.month==year+"-06"){
                June=li.num;
            }
            if(li.month==year+"-07"){
                July=li.num;
            }
            if(li.month==year+"-08"){
                August=li.num;
            }
            if(li.month==year+"-09"){
                September=li.num;
            }
            if(li.month==year+"-10"){
                October=li.num;
            }
            if(li.month==year+"-11"){
                November=li.num;
            }
            if(li.month==year+"-12"){
                December=li.num;
            }
        });
        var map={};
        map["January"]=January;
        map["February"]=February;
        map["March"]=March;
        map["April"]=April;
        map["May"]=May;
        map["June"]=June;
        map["July"]=July;
        map["August"]=August;
        map["September"]=September;
        map["October"]=October;
        map["November"]=November;
        map["December"]=December;

        return map;
	}


    $.post(path+"/StatsController/countUser",function (data) {

		console.log(data["club"]);

		var map=listToAll(data["user"]);
        var map1=listToAll(data["club"]);


        Highcharts.chart('container', {
            title: {
                text: '每月注册人数',
                x: -20 //center
            },
            subtitle: {
                text: 'Source: WorldClimate.com',
                x: -20
            },
            xAxis: {
                categories: ['一月', '二月', '三月', '四月', '五月', '六月','七月', '八月', '九月', '十月', '十一月', '十二月']
            },
            yAxis: {
                title: {
                    text: '注册人数'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            tooltip: {
                valueSuffix: '人'
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'middle',
                borderWidth: 0
            },
            series: [{
                name: '商家',
                data: [map1.January, map1.February, map1.March, map1.April, map1.May, map1.June, map1.July, map1.August, map1.September, map1.October, map1.November, map1.December]
            }, {
                name: '用户',
                data: [map.January, map.February, map.March, map.April, map.May, map.June, map.July, map.August, map.September, map.October, map.November, map.December]
            }]
        });


    },'json');





});
</script>
</body>
</html>